/* eslint-disable */
<template>
  <div class="row body">
    <!--    循环遍历-->
    <div style="width: 100%;" v-for="(article,index) in info" :key="index">
      <div class="row" v-if="article.articleTime && years[index] != years[index-1]">
        <div style="width: 80%;margin-top: 30px;">
          <div class="yearmonth" style="margin-bottom: 20px;"><span
            class="font">{{article.articleTime.slice(0,7)}}</span></div>
        </div>
      </div>
      <div class="row" style="width: 100%;">
        <div class="col-9" style="border-right: 3px #eceff2 solid;">
          <div class="row">
            <div style="width: 90%;">
              <a :href="'http://localhost:8080/content/'+article.articleId">
                <div class="box bg-white" style="box-shadow: 1px 1px 6px #888888;">
                <table class="table table-striped">
                  <thead>
                  <tr>
                    <th style="width: 100%;color: crimson;"><span class="font">{{article.articleTitle}}</span></th>
                  </tr>
                  </thead>
                  <tbody v-if="article.articleLable">
                  <tr>
                    <td style="padding: 10px 5px;">
                      <span>标签：</span>
                      <div class="biaoqian" v-for="(lable,index) in article.articleLable.split(',')" :key="index">
                        <span class="font">{{lable}}</span>
                      </div>
                    </td>
                  </tr>
                  </tbody>
                </table>
              </div>
              </a>
            </div>
            <div style="width: 10%;">
              <i class="zi zi_starLine" style="font-size:20px;line-height: 120px;"></i>
              <i class="zi zi_starLine"
                 style="font-size:20px;line-height: 120px;float: right;color: skyblue;margin-right: -11px;"></i>
            </div>
          </div>
        </div>
        <div class="col-3">
          <div style="margin-top: 30%;">
            <div class="mulu_neirong">
              <li><a href="##" class="btn btn-outline-primary btn-sm"><span class="font">{{article.articleTime}}</span></a>
              </li>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div style="margin: 0 auto">
      <page :total="totalpages" @pagechange="pagechange" v-if="totalpages != null"></page>
    </div>
  </div>
</template>

<script>
  import Page from "../public/Page";
  export default {
    name: 'down',
    components:{
      "page": Page
    },
    data() {
      return {
        info: [
          {
            articleId: null,
            articleTitle: null,
            articleTime: null,
            articleLable: null
          }
        ],
        years: [],
        urlfix: "http://localhost:9000",
        textList:[],
        totalpages: null,
        everypage:null,
        useridd: null
      }
    },
    methods: {
      getdata: function () {
        let that = this;
        this.axios.get('http://localhost:9000/cyj/findArchiveByUserId/'+this.useridd).then(function (response) {
          // console.log(response.data.data)
          that.totalpages = Math.ceil(response.data.data.length/10);
        })
      },
      one:function () {
        for (let i = 0;i < this.info.length;i++){
          if (this.info[i].articleTime != null){
            this.years.push(this.info[i].articleTime.slice(0,7))
          }
        }
      },
      pagechange(everypages){
        // console.log("everypages:"+everypages)
        let that = this
        that.textList = []
        that.everypage = everypages
        // console.log("everypage:"+that.everypage)
        let url = this.urlfix+"/cyj/selectPage";
        let data1 = {
          userid: that.useridd,
          page:that.everypage
        };
        $.post(url,data1,function (data) {
          if (data.code === 20000){
            // console.log(data)
            $.each(data.data,function (index,item) {
              // console.log(item)
              that.textList.push(item);
            })
            // console.log(data.data)
            that.info = that.textList
            // console.log(that.textList)
          }
        })
      }
    },
    created() {
      this.useridd = window.sessionStorage.getItem('userId')
      this.getdata()
    },
    beforeUpdate() {
      this.one()
    },
    /*beforeMount() {
      let url = this.urlfix+"/cyj/selectPage";
      let that = this;
      console.log("beforeMount执行了")
      let data1 = {
        userid: "1",
        page:'1'
      };
      $.post(url,data1,function (data) {
        if (data.code === 20000){
          // console.log(data)
          $.each(data.data,function (index,item) {
            // console.log(item)
            that.textList.push(item);
          })
          // console.log(data.data)
          that.info = that.textList
          // console.log(that.textList)
        }
      })
    }*/
  }
</script>

<style scoped>
  @import '../../../static/css/cyj.css';
</style>
